import VueRouter from "vue-router";
import Vue from "vue";
import MyAdmin from "@/views/MyAdmin.vue";
import MyInfo from "@/views/MyInfo.vue";
import Note from "@/views/Note.vue";
import Avatar from "@/views/Avatar.vue";
import Family from "@/views/Family.vue";

Vue.use(VueRouter)
//定义路由规则
const  router=new VueRouter({
    routes:[
        {
            path:"/redirect",
            redirect:"/myadmin/2222"
        },
        {
            path:"/myadmin/:id",//声明式路由参数传递
            name:"MyAdmin",//匹配的路由名字
            component:MyAdmin//组件对象
        },
        {
            path:"/myinfo/:name",
            name:"MyInfo",
            component:MyInfo,
            children:[//子路由，嵌套路由
                {
                    path:"avatar",
                    name:"Avatar",
                    component:Avatar
                },
                {
                    path:"family",
                    name:"Family",
                    component:Family
                }
            ]
        },
        {
            path:"/note",
            name:"Note",
            component:Note
        }
    ]
})
//前置路由守卫
router.beforeEach((to,from,next)=>{
    console.log("to,要路由取的目的地页面",to)
    console.log("from,当前路由的来源页面",from)
    next()
})
//后置路由守卫
router.afterEach((to,from)=>{
    console.log("后置守卫")
})
//导出路由配置,才能在main.js中引用
export default router;